/**
 * 培训大纲-其他要求
 */
<template>
   <vp-main-page @refresh="loadDataList" :custom="false" :zoom="false">
		<template #actions>
			<vp-btn-add v-if="positionId" v-auth="'trainingOutline.edit'" @click="handleAddOtherRequirement" />
		</template>
		<template #table>
			<vp-table ref="tableRef" :data="tableData" row-key="id" v-loading="loading">
				<el-table-column  type="index" align="center" label="#">
				</el-table-column>
				<el-table-column prop="qtyq" min-width="300" show-overflow-tooltip>
					<template #header><vp-label zh="其他要求" en="Other Requirement"/></template>
				</el-table-column>
				<el-table-column fixed="right" width="100">
					<template #header>
						<vp-label-operations/>
					</template>
					<template #default="{ row }">
						<vp-btn-del text v-auth="'trainingOutline.edit'" @click="handleDelOtherRequirement(row)"/>
					</template>
				</el-table-column>
			</vp-table>
		</template>

		<!-- 新增/修改其他要求页面 -->
		<EditOtherRequirement ref="editOtherRequirementRef" @formSubmited="loadDataList"></EditOtherRequirement>
	</vp-main-page>
</template>
<script setup lang="ts" name="otherRequirementTab">
import { defineAsyncComponent, onMounted, ref, watch } from 'vue';
import VpMessageBox from '/@/components/vp/VpMessageBox';
import request from '/@/utils/request';

	const EditOtherRequirement = defineAsyncComponent(() => import('../dialogs/EditOtherRequirement.vue'));

	const props = defineProps({
		positionId: {
			type: String
		},
	});

	// 监听岗位id改变，则刷新页面
	watch(()=> props.positionId, ()=>{
		loadDataList();
	})

	// 组件挂载后事件
	onMounted(() => {
		loadDataList()
	})

	const tableData = ref([]);
	const loading = ref(false);

	// 加载列表数据
	const loadDataList = () => {
		loading.value = true;
		request.get('/training/position/otherRequirement/list', {
			params: {
				mainid: props.positionId,
			}
		}).then(res => {
			tableData.value = res?.data || [];
		}).finally(()=>{
			loading.value = false;
		})	
	}

	// 新增其他要求
	const editOtherRequirementRef = ref();
	const handleAddOtherRequirement = () => {
		editOtherRequirementRef.value.handleOpen({
			type: 'add',
			mainid: props.positionId
		});
	}

	// 删除其他要求
	const handleDelOtherRequirement = (row: any) => {
		VpMessageBox.confirmDelete().then(()=>{
			request.delete(`/training/position/otherRequirement/${row.id}`).then(res => {
				loadDataList();
			})
		});
	}

</script>
